<template>
  <div>
    <span>
      <a v-if="canEdit" @click="$emit('edit')"><EditOutlined />编辑</a>
      <a-divider v-if="canEdit && canDelete" type="vertical" />
      <a-popconfirm
        v-if="canDelete"
        title="确定删除吗？"
        okText="确定"
        cancelText="取消"
        @confirm="$emit('delete')"
      >
        <a><DeleteOutlined />删除</a>
      </a-popconfirm>
    </span>
  </div>
</template>

<script>
import { EditOutlined, DeleteOutlined } from '@ant-design/icons-vue'

export default {
  name: 'TableOperation',
  emits: ['delete', 'edit'],
  props: ['canEdit', 'canDelete'],
  components: {
    EditOutlined,
    DeleteOutlined,
  },
}
</script>
